import React from 'react';
import Header from "./components/Header";
import Task from "./components/Task";
import News from "./components/News";
import Circulation from "./components/Circulation";
import Borrowing from "./components/Borrowing";

import {Row, Col} from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import {summary} from '@/services/Workbench';


class Home extends React.Component{

  constructor(props) {
    super(props);
    this.state = {
      headerDataInfo: {}, // 头部数据
      newsList: [] // 动态
    };
  }

  async componentDidMount () {
    try {
      const res = await summary();
      const {subUnitNum, borrowNumOfToday, visitNumOfToday, borrowLog} = res;
      this.setState({
        headerDataInfo: {
          subUnitNum,
          borrowNumOfToday,
          visitNumOfToday
        },
        newsList: borrowLog || []
      })
    } catch (e) {
      console.error(e);
    }
  }


  render () {
    const headerDataInfo = this.state.headerDataInfo;
    const newsList = this.state.newsList;
    return (
      <PageContainer
        content={<Header.UserInfo/>}
        extraContent={<Header.DataInfo info={headerDataInfo}/>}>
        <Row gutter={24}>
          <Col xl={16} lg={24} md={24} sm={24} xs={24}>
            <Task/>
          </Col>
          <Col xl={8} lg={24} md={24} sm={24} xs={24}>
            <News list={newsList}/>
          </Col>
        </Row>
        <Row gutter={24}>
          <Col xl={12} lg={24} md={24} sm={24} xs={24}>
            <Circulation />
          </Col>
          <Col xl={12} lg={24} md={24} sm={24} xs={24}>
            <Borrowing />
          </Col>
        </Row>
      </PageContainer>
    )
  }

};

export default Home;
